/*
    move    运动函数
        
    @param  object      element     要执行运动效果的标签对象
    @param  object      object      要执行运动效果的css样式和最终值
    @param  function    callback    运动结束触发的回调函数 默认值是 空函数

    没有return返回值 

*/ 

function move( element , object , callback = function(){} ){
    // 定义变量 存储 定时器个数
    let num = 0 ;

    // 循环遍历参数2
    for( let type in object ){
        // 每次循环都会生成一个对应的定时器 变量累加1
        num++ ;

        // 获取 初始值 兼容透明度
        let startVal = type === 'opacity' ? window.getComputedStyle( element )[type] * 100 : parseInt( window.getComputedStyle( element )[type] );

        // 获取 最终值 兼容透明度
        let endVal = type === 'opacity' ? object[type] * 100 : object[type] ;


        // 生定时器
        let time = setInterval( ()=>{
            // 计算步长
            let step = ( endVal - startVal ) / 10 ;

            // 步长取整
            step = step > 0 ? Math.ceil( step ) : Math.floor( step );

            // 初始值 累加 步长值
            startVal += step;

            // 将 改变之后的 初始值 赋值给 标签对象 兼容透明度
            element.style[type] = type === 'opacity' ? startVal / 100 : startVal + 'px' ;

            // 判断 初始值 和 最终值 
            if( startVal === endVal ){
                // 清除定时器
                clearInterval( time );

                // 变量累减1 表示 存储的定时器个数少一个
                num-- ;


                // 如果变量储存的数值恢复到初始值 0 
                if( num === 0 ){
                    // 证明所有定时器都清除了 
                    // 也就是 运动都停止了 
                    // 触发 执行 回调函数
                    callback() ;
                }
            }

        } , 30 )
    }


}